import axios from "axios";
import store from "@/store";

const request = axios.create({
  baseURL: "http://toutiao-app.itheima.net/"
});
// 请求拦截器
request.interceptors.request.use(
  function(config) {
    const { user } = store.state;
    if (user && user.token) {
      config.headers.Authorization = `Bearer ${user.token}`;
    }
    return config;
  },
  function(error) {
    return Promise.reject(error);
  }
);
// 响应拦截器
request.interceptors.response.use(
  // 第一个函数就是正常响应的时候要调用的函数
  function(response) {
    return response;
  },
  // 第二个函数时候响应出错的时候会执行的函数
  async function(error) {
    // 函数的形参error就是 响应时报的错误
    // 下面的if判断就是判断 错误的状态码是不是 401，如果是401代表就是token过期了
    if (error.response && error.response.status === 401) {
      // 获取到Vuex中保存的user用户数据，在user用户数据中包含了过期的token，和refresh_token
      const user = store.state.user;
      // 如果user不存在，或者user里面没有refresh_token
      if (!user || !user.refresh_token) {
        // 跳转到登录页面
        this.$router.push("/login");
        return false;
      }
      // 执行try...catch
      try {
        // 当我们请求刷新用户token的接口之后，接口返回的数据中就包含了 最新的token
        const res = await axios({
          method: "PUT",
          url: "http://toutiao-app.itheima.net/v1_0/authorizations",
          headers: {
            Authorization: `Bearer ${user.refresh_token}`
          }
        });
        // console.log(res)
        // 将最新的token和refresh_token保存到Vuex中，
        store.commit("setUser", {
          token: res.data.data.token,
          refresh_token: user.refresh_token
        });
        // request( {url: method: }  )
        // error.config就是之前发生错误的那次请求的配置对象
        // 按照之前错误的那次请求的配置，重新请求一次
        return request(error.config);
      } catch (error) {
        this.$router.push("/login");
      }
    }
    return Promise.reject(error);
  }
);

export default request;
